<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    .first{
        width:1600px;
        height:80px;
        margin-left:30px;
        background-color:#3CF;
    }
    .header {
        width: 1600px;
        height: 40px;
        background: blue;
        margin-left: 30px;
        margin-top:20px;
    }
    ol{
        margin-left: 100px;
        margin-top: 50px;
    }
    ol li{
        list-style: none;
        float:left;
        padding:15px;
        border:1px solid black;
       width:150px;
       height:5px;
      }
      form{
        margin-top: 50px;
        margin-left: 120px;

      }
    form input{
        width:300px；
        margin-top:50px;
        margin-left:20px;
    }
   button{
    margin-left: 100px;
    width:250px;
    height: 40px;
   }
   .all{
    width:1629px;
    height:1000px;
    background-color:#6CF;
   }
 
</style>
<body>
  <div class="all">
<div class="first">
<img src="images/1.PNG" />
    <a href="#"style="position:absolute; margin-top:35px;">了解更多|返回意见</a>
</div>

<div class="header">
    <h4 style="margin-left:20px;   color: white";>欢迎注册无线容量的网易邮箱！邮件地址可以登录使用其他网易旗下产品</h4>
</div>

<ol>
    <li style=" background: blue;">注册字母邮箱</li>
    <li>注册手机号码邮箱</li>
    <li>注册VIP邮箱</li>
</ol>

<br>
<form>
<label>*邮件地址</label><input type="text" name="" style="width:350px; height:25px;"  />
<label>@</label>
  <select style="height:30px">
  <option  selected="selected">163.com</option>
  <option>169.com</option>
  <option>186.com</option>
  <option>159.com</option>
  <option>146.com</option>
  <option>198.com</option>
  <option>152.com</option>
  </select>
<br>
 <h8 style="color:gray; margin-left:90px; padding-top:10px; ">6~18个字符，可使用字母，数字，下划线，需以字母开头</h8><br>

 <label style=" margin-left:30px;">*密码</label><input type="text" name="" style="width:450px; height:25px; margin-top:30px; margin-bottom:10px; " />
 <br>
 <h8 style="color:gray;  margin-left:50px; ">6~16个字符，区分大小写</h8>
<br>
 <label>*确定密码</label><input type="text" name="" style="width:450px; height:25px; margin-top:30px; "/>
 <br>
 <h8 style="color:gray;  margin-left:50px;">请再次填写密码</h8>
<br>
 <label>*手机号码</label><input type="text" name="" value="+86-" style="width:450px; height:25px;margin-top:30px; " /><br>
 <h8 style="color:gray;  margin-left:50px;">忘记密码时，可以通过该手机号快速找回密码</h8>
<br>
 <label style="margin-left:20px;">*验证码</label><input type="text" name="" style="width:350px; height:25px; margin-top:30px;" /> <img src="images/2.JPEG" height="47"  style=" width:90px; margin-left: 5px; margin-top:-10px; " /> <br>
 <h8 style="color:gray;  margin-left:50px;"> 
 请填写图片中的字符，不区分大小写</h8>  <h6 style=" color:blue; margin-top:-40px;  margin-left:450px;  margin-top:-16px; ">看不清楚？换张图片</h6>
 <br>
  <button>免费获取验证码</button>
  <br>
  <label  style="margin-left:-5px;"  >*短信验证码</label><input type="text" name="" style="width:450px; height:25px; margin-top:30px;"  />
 <h8 style=" color:gray ; margin-left:50px;" > <br>
 请查收手机短信，并填写短信中的验证码</h8> <br>

  <input name="checkbox"  type="checkbox" checked="checked" style=" margin-top:30px; margin-left:100px;" value+" 同意"服务条款"和"隐私权相关政策""/>
  <br>
    <button style=" background-color:green; width:150px; height:60px; margin-top: 30px; ">立即注册</button>
  
    <img src="images/4.GIF" style=" position:absolute; width:500px; height: 810px; float:left ; margin-top: -702px; margin-left:755px; background-color: #f1f1f1; " />
    <div class="footer">
      <h4>关于网易  关于网易免费邮  邮箱官方博客  客户服务  隐私政策  |  网易公司版权所有 © 1997-2018 <br> </h4>
<h5>数据来源：艾媒咨询《2015-2018中国个人邮箱行业研究报告》 </h5>
</div>

</div>
</form>
</body>
</html>